<template>
  <div class="home">
    <!-- 路由出口 -->
    <keep-alive include="First,searchresult,my,video">
      <router-view></router-view>
    </keep-alive>
    <van-tabbar
      route
      active-color="#3296fa"
      inactive-color="#646566"
      class="tabbar"
      placeholder
      v-if="$route.meta.needTab"
    >
      <van-tabbar-item to="/home/first"
        ><template #default>首页</template
        ><template #icon>
          <i class="iconfont">&#xe669;</i>
        </template></van-tabbar-item
      >
      <van-tabbar-item to="/home/search"
        ><template #default>搜索</template
        ><template #icon>
          <i class="iconfont">&#xe651; </i>
        </template></van-tabbar-item
      >
      <van-tabbar-item to="/home/video"
        ><template #default>视频</template
        ><template #icon>
          <i class="iconfont f33">&#xe606;</i>
        </template></van-tabbar-item
      >
      <van-tabbar-item to="/home/my"
        ><template #default>我的</template
        ><template #icon>
          <i class="iconfont f22">&#xe642;</i>
        </template></van-tabbar-item
      >
    </van-tabbar>
  </div>
</template>

<script>
export default {
  name: 'home',
  created(){
    // document.title = this.$route.meta.title
  }
}
</script>

<style lang="less" scoped>
.home {
  ::v-deep .van-tabbar {
    padding: 5px 0 3px;
  }
  .tabbar {
    .iconfont.f33 {
      font-size: 26px;
      padding-left: 4px;
    }
    .iconfont.f22 {
      font-size: 28px;
    }
    .iconfont {
      font-size: 26px;
    }
  }
}
</style>
